<%@ page language="java" contentType="text/html; charset=utf-8"%>
<%@ include file="/taglibs.jsp"%>
<html>
<head>
<title>IT管理后台</title>
<link rel="stylesheet" type="text/css" href="/js/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="/js/themes/icon.css">
<script type="text/javascript" src="/js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="/js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="/js/easyui_validatebox.js"></script>
<script type="text/javascript" src="/js/locale/easyui-lang-zh_CN.js"></script>
<script src="/js/print.js" type="text/javascript"></script>
<style type="text/css">

td {
	font-size: 13px;
}
table.ttb{border-left:solid 1px #99bbe8;border-top: solid 1px #99bbe8;}
table.ttb td{word-break: break-all; word-wrap:break-word;vertical-align: top; padding-left:8px; border-right: solid 1px #99bbe8;border-bottom: solid 1px #99bbe8; line-height: 24px; font-size: 12px;}
.bg001{font-weight: bold; color: #333; background-color: #edf4fc}
#sb-add td{
	text-align: right;
}
#sb-edit td{
	text-align: right;
}
</style>
	<script>
		$(function(){
			$('#tab').datagrid({
				title:'记录信息',
				iconCls:'icon-save',
				nowrap: false,
				striped: true,
				pageSize:20,
				sortName:"id",
				sortOrder:"desc",
				pageList:[10,20,30,40,50],
				url:'/itmanager/sb/json',
				remoteSort: false,
				idField:'id',
				frozenColumns:[[
	                	{field:'ck',checkbox:true},
	                	{title:'记录编号',field:"sbbh",width:80},
						{title:'记录分类',field:"sbflmc",width:80},
						{title:'记录名称',field:"sbmc",width:120},
						{title:'记录时间',field:"jhsj",width:80},
						{title:'记录状态',field:"zt",width:80,formatter:
					    	 function(value,rowData,rowIndex){
					    	 if(value == "0"){
					    		 return "<font color='red'>使用</font>";
					    	 }
					    	 else if(value == "1"){
					    		 return "<font color='red'>闲置</font>";
					    	 }
					    	 else if(value == "2"){
					    		 return "<font color='red'>借出</font>";
					    	 }else if(value == "3"){
					    		 return "<font color='red'>待修</font>";
					    	 }else if(value == "4"){
					    		 return "<font color='red'>已坏</font>";
					    	 }
				     	},
				     	editor:{
							type:'combobox',
							options:{
								valueField:'value',
								textField:'text',
								data:[{"text":"使用","value":"0"},{"text":"闲置","value":"1"},{"text":"借出","value":"2"},{"text":"待修","value":"3"},{"text":"已坏","value":"4"}],
								required:true
								}
							}
						}
	                ]],
				columns:[
					[
						{title:'记录属性',field:"sbsx",width:500}
					]
				],
				fit:true,
				fitColumns:true,
				border:false,
				pagination:true,
				rownumbers:true,
				toolbar:[{
					id:"1",
					text:'添加',
					disabled:true,
					iconCls:'icon-add',
					handler:function(){

						/* sbadd.window({
							onBeforeOpen:function(){
								sbaddform.form('clear');
								$("#zt-add").val('1');
								$.ajax({
									   type: "get",
									   url: "/itmanager/sbfl/all",
									   success: function(msg){
										   var bmm = $("#sbfl-add")[0];  //把jquery对象转成dom对象使用
										   clearSel(bmm); //清空
										   msg=$.parseJSON(msg);
										   $.each(msg, function(i, b) {
												var value = b.id;
												var text = b.sbflmc;
												var option = new Option(text, value);
												bmm.options.add(option);
												//textsx(b.id);
											});
									   }
									});
								
							}
						});
						sbadd.window("open"); */
					}
				},'-',{
					id:'2',
					text:'修改',
					disabled:true,
					iconCls:'icon-edit',
					handler:function(){
						sbedit.window({
							onBeforeOpen:function(){
								sbeditform.form('clear');
								var rows = $("#tab").datagrid("getSelections");
								var length = rows.length;
								if(length != 1){
									$.messager.alert("友情提示","<br/><b>只能选择一条记录！</b>","error");
									return false;
								}
								var id=rows[0].id;
								$("#edit-table").html("");
								$.ajax({
							 		type:"get",
							 		url:"/itmanager/sb/toedit",
							 		data:"id="+id,
							 		cache:false,
							 		success:function(data){
							 		 	data=$.parseJSON(data);
							 		 	$.ajax({
											   type: "get",
											   url: "/itmanager/sbfltysx/getsx",
											   data:"id="+data.sbflid,
											   cache:false,
											   async: false,
											   success: function(msg){
												   var obj=$.parseJSON(msg);
												   $.each(obj,function(i,tysx){
													   if(tysx.tysxlx=="0"){
														   $("#edit-table").append("<tr><td width='40%'>"+tysx.tysxmc+"：</td>"+
														   "<td width='60%'><input type='text' name='"+tysx.id+"'/></td></tr>");
													   }else if(tysx.tysxlx=="1"){
														   $("#edit-table").append("<tr><td width='40%'>"+tysx.tysxmc+"：</td>"+
																   "<td width='60%'><input type='text' onfocus='changetodatabox()' class='change-databox' style='width:150px;' name='"+tysx.id+"'/></td></tr>");
													   }else if(tysx.tysxlx=="2"){
														   $("#edit-table").append("<tr><td width='40%'>"+tysx.tysxmc+"：</td>"+
																   "<td width='60%'><textarea name='"+tysx.id+"' style='width:99%;height:100px;'></textarea></td></tr>");
													   }
												   });
											   }
											});
										$("#sbbh-edit").val(data.sbbh);
										$("#sbmc-edit").val(data.sbmc);
										$("#jhsj-edit").datebox("setValue",data.jhsj);
										$("#zt-edit").val(data.zt);
										for(var k in data.sbsx){	//程序后台把sbsx已经组装成json形式了，这边data.sbsx就是个json对象
											$("#edit-table input[type=text][name="+k+"]").val(data.sbsx[k]);
											//k代表json对象中的属性组，data.sbsx[k]表示该属性对应的value值。
											/* alert(k+"="+data.sbsx[k]); */
											$("#edit-table textarea[name="+k+"]").val(data.sbsx[k]);
										}
							 		}
							 	});
							}
						});
						sbedit.window("open");
					}
				},'-',{
					id:'11',
					text:'查看详情',
					disabled:true,
					iconCls:'icon-search',
					handler:function(){
						show();
					}
				},'-',{
					id:'3',
					text:'删除',
					disabled:true,
					iconCls:'icon-remove',
					handler:function(){
						deleteSb();
					}
				},'-',{
					id:'12',
					text:'修改状态',
					disabled:true,
					iconCls:'icon-redo',
					handler:function(){
						$('#tab').datagrid('acceptChanges');
					}
				},'-',{
					id:'7',
					text:'取消',
					disabled:true,
					iconCls:'icon-undo',
					handler:function(){
						$('#tab').datagrid('rejectChanges');
					}
				},'-',{
					id:'9',
					text:'打印',
					disabled:true,
					iconCls:'icon-print',
					handler:function(){
						startPrint($(".datagrid-view")[0]);
					}
				}],
				onAfterEdit:function(rowIndex, rowData, changes){
					
					$.ajax({
							type: "post",
							url: "/itmanager/sb/editZt",
							data: rowData,
							success: function(msg){
								if (msg=='success'){  
									$.messager.show({
										title:'信息提示',
										msg:'修改成功！',
										timeout:2000,
										showType:'slide'
									});
						        	$("#tab").datagrid("reload");
						         } else if(msg=='error'){
						           	$.messager.alert('信息提示','修改失败！','error');
						         }
							}
					});
				},
				onDblClickRow:function(rowIndex, rowData){
					$('#tab').datagrid('endEdit', rowIndex);
					$('#tab').datagrid('beginEdit', rowIndex);
					
				},
				onClickRow:function(rowIndex, rowData){
					var row=$('#tab').datagrid('getSelected');
					var index=$('#tab').datagrid('getRowIndex',row);
					if (index == -1){
						$('#tab').datagrid('selectRow',rowIndex);
					}else{
						$('#tab').datagrid('unselectRow',rowIndex);
					}
				},
				onLoadSuccess:function(data){
					var ens='${param.en}';
					var en=ens.split(":");
					 for(var i=0;i<en.length;i++){
						 if(en[i] == '1'){ 
							 $("#1").menubutton({
									menu:"#mm"
								});
						 }
						 if(en[i] != "" && en[i] != null){
						 	$("#"+en[i]).linkbutton('enable');
						 }
					 }
					 
				}
			});
			
			 $("#tab").datagrid("getPager").pagination({
				   onSelectPage:function(){
					  $("#tab").datagrid("clearSelections");
					  var queryParams = $.extend({},$("#tab").datagrid("options").queryParams,
							  {spsbmc:$("#sbmc-search").val(),spsbfl:$("#sbfl-search").val(),spzt:$("#zt-search").val(),spbfjlsj:$("#bfjlsj-search").datebox("getValue"),spafjlsj:$("#afjlsj-search").datebox("getValue")}); 
					  $("#tab").datagrid("reload",queryParams);
				   }
			  });
			 
			sb = $('#sb-window').window({
				modal: true,
				maximizable:false,
				minimizable:false,
				collapsible:false,
				closed:true
			});
			sbadd = $('#sb-add').window({
				modal: true,
				maximizable:false,
				minimizable:false,
				collapsible:false,
				closed:true
			});
			sbaddform=sbadd.find("form");
			sbedit = $('#sb-edit').window({
				modal: true,
				maximizable:false,
				minimizable:false,
				collapsible:false,
				closed:true
			});
			sbedit.window({
				onBeforeClose:function(){
					var queryParams = $.extend({},$("#tab").datagrid("options").queryParams);
		 			$("#tab").datagrid("reload",queryParams);
				}
			});
			sbeditform=sbedit.find("form");
			
		});
		
		
		var find = function(){
			$("#tab").datagrid("clearSelections");
			var queryParams = $.extend({},$("#tab").datagrid("options").queryParams,{spsbmc:$("#sbmc-search").val(),spsbflid:$("#sbflid-search").val(),spzt:$("#zt-search").val(),spbfjlsj:$("#bfjlsj-search").datebox("getValue"),spafjlsj:$("#afjlsj-search").datebox("getValue")}); 
			$("#tab").datagrid("getPager").pagination({pageNumber:1});
			$("#tab").datagrid("reload",queryParams);
		}
		
		var show=function(){
			var rows = $("#tab").datagrid("getSelections");
			var length = rows.length;
			if(length != 1){
				$.messager.alert("友情提示","<br/><b>只能选择一条记录！</b>","error");
				return false;
			}
			var id=rows[0].id;
			$.ajax({
		 		type:"get",
		 		url:"/itmanager/sb/show",
		 		data:"id="+id,
		 		success:function(data){
		 		 	sb.window("open");
		 		 	data=$.parseJSON(data);
					mtext("#sb-sbbh",data.sbbh);
					mtext("#sb-sbfl",data.sbflmc);
					mtext("#sb-sbmc",data.sbmc);
					mtext("#sb-jhsj",data.jhsj);
					mtext("#sb-sbsx",data.sbsx);
					var zt=data.zt;
					if(zt=='0'){
						mtext("#sb-zt","使用");
					}else if(zt=='1'){
						mtext("#sb-zt","闲置");
					}else if(zt=='2'){
						mtext("#sb-zt","借出");
					}else if(zt=='3'){
						mtext("#sb-zt","待修");
					}else if(zt=='4'){
						mtext("#sb-zt","已坏");
					}
		 		}
		 	});
		}
		
		function changetodatabox(){
			$(".change-databox").datebox();
		}
		
		function textsx(id){
			$.ajax({
				type: "get",
				url: "/itmanager/common/clid",
				data: "id="+id,
				success: function(msg){
					var data=$.parseJSON(msg);
					var bhsx=data.bhsx;
					if(bhsx != undefined && bhsx!=null){
						var bh=bhsx.split("&");
						$("#add-textsx").html("");
						for(i=0;i<bh.length;i++){
							$("#add-textsx").append(bh[i]);
						}
					}
				}
			});
		}
		
		function mtext(target,text){
			$(target).html("&nbsp;");
			$(target).html(text);
		}
		
		function clearSel(oSelect) {
			while (oSelect.childNodes.length > 0) {
				oSelect.removeChild(oSelect.childNodes[0]);
			}

		}
		
		function closeSbadd(){
			sbadd.window('close');
		}
		function closeSbedit(){
			sbedit.window('close');
		}
		
		/* function changesx(name,value){
			var str;
			str=name+"="+value+",";
			$("#sbsx-add").val(str);
		} */
		
		function openWinSb(id){
			 sbadd.window({
				onBeforeOpen:function(){
					sbaddform.form('clear');
					$("#zt-add").val('1');   //默认选中状态为闲置
					$("#sbflid-add").val(id);
					$("#add-table").html("");	//清空add-table的内容
					$.ajax({					//根据sbflid来查询对应的特有属性
						   type: "get",
						   url: "/itmanager/sbfltysx/getsx",
						   data:"id="+id,
						   cache:false,
						   async: false,
						   success: function(msg){
							   var data=$.parseJSON(msg);
							   $.each(data,function(i,tysx){	//查出的特有属性一一的生成input形式内容
								   if(tysx.tysxlx=="0"){
									   $("#add-table").append("<tr><td width='40%'>"+tysx.tysxmc+"：</td>"+
									   "<td width='60%'><input type='text' name='"+tysx.id+"'/></td></tr>");
								   }else if(tysx.tysxlx=="1"){
									   $("#add-table").append("<tr><td width='40%'>"+tysx.tysxmc+"：</td>"+
											   "<td width='60%'><input type='text' onfocus='changetodatabox()' class='change-databox' style='width:150px;' name='"+tysx.id+"'/></td></tr>");
								   }else if(tysx.tysxlx=="2"){
									   $("#add-table").append("<tr><td width='40%'>"+tysx.tysxmc+"：</td>"+
											   "<td width='60%'><textarea name='"+tysx.id+"' style='width:99%;height:100px;'></textarea></td></tr>");
								   }
							   });
						   }
						});
				}
			}); 
			sbadd.window("open");
		}
		
		function createSb(){
			var inputs=$("#add-table input[name!='']");	//获得所有add-table里的特有属性元素
			var str="";
			$.each(inputs,function(i,input){	//遍历元素，组装出要存入数据库里的形式
				if(input.value!=""){
					str=str+input.name+"="+input.value+",";
				}
			});
			var tareas=$("#add-table textarea[name!='']");
			$.each(tareas,function(i,tarea){	//遍历元素，组装出要存入数据库里的形式
				if(tarea.value!=""){
					str=str+tarea.name+"="+tarea.value+",";
				}
			});
			$("#sbsx-add").val(str);
			sbaddform.form('submit', {  
				  url:sbaddform.action,
				  onSubmit:function(){
				        return $(this).form('validate');
				    },
				  success:function(data){
				          if (data=='success'){  
				        	  	$.messager.alert('信息提示','添加成功！','right');  
				                sbadd.window('close');  
				                var queryParams = $.extend({},$("#tab").datagrid("options").queryParams);
					 			$("#tab").datagrid("reload",queryParams);
				            } else if(data=='error'){
				            	$.messager.alert('信息提示','添加失败！','error');
				            }
				     }  
			}); 
		}
		
		function editSb(){
			var rows = $("#tab").datagrid("getSelections");
			var length = rows.length;
			if(length != 1){
				$.messager.alert("友情提示","<br/><b>只能选择一条记录！</b>","error");
				return false;
			}
			var id=rows[0].id;
			var inputs=$("#edit-table input[name!='']");
			var str="";
			$.each(inputs,function(i,input){
				if(input.value!=""){
					str=str+input.name+"="+input.value+",";
				}
			});
			var tareas=$("#edit-table textarea[name!='']");
			$.each(tareas,function(i,tarea){	//遍历元素，组装出要存入数据库里的形式
				if(tarea.value!=""){
					str=str+tarea.name+"="+tarea.value+",";
				}
			});
			$("#sbsx-edit").val(str);
			sbeditform.form('submit', {  
				  url:"/itmanager/sb/edit?id="+id,
				  onSubmit:function(){
				        return $(this).form('validate');
				    },
				  success:function(data){
				          if (data=='success'){  
				        	  	$.messager.alert('信息提示','修改成功！','right');  
				            } else if(data=='error'){
				            	$.messager.alert('信息提示','修改失败！','error');
				            }
				     }  
			});  
		}
		
		var deleteSb = function(){
			var rows = $("#tab").datagrid("getSelections");
			var length = rows.length;
			if(length == 0){
				$.messager.alert("友情提示","<br/><b>请先选择记录！</b>","error");
				return false;
			}
			var ids = [];
			for(var i=0;i<length;i++){
				ids.push(rows[i].id);
			}
			ids.join(",");
			$.messager.confirm("友情提示","<br/><b>确定删除记录？</b>",function(result){
				if(result){
					$.ajax({
				 		type:"post",
				 		url:"/itmanager/sb/delete",
				 		data:"ids="+ids,
				 		success:function(data){
				 			if(data=='success'){
				 		 		var queryParams = $.extend({},$("#tab").datagrid("options").queryParams);
				 				$("#tab").datagrid("reload",queryParams);
				 				$("#tab").datagrid("clearSelections");
				 			}else if(data=='error'){
				 				$.messager.alert("友情提示","<br/><b>删除记录出错！</b>","error");
				 			}
				 		}
				 	});
				}
			});
		} 
		
		
		
		/* var sh = function(param){
			var rows = $("#tab").datagrid("getSelections");
			var length = rows.length;
			if(length == 0){
				$.messager.alert("友情提示","<br/><b>请先选择记录！</b>","error");
				return false;
			}
			var ids = [];
			for(var i=0;i<length;i++){
				ids.push(rows[i].id);
			}
			ids.join(",");
		 	$.ajax({
		 		type:"post",
		 		url:"/manager/yg/sh",
		 		data:"shqk="+param+"&ids="+ids,
		 		success:function(data){
		 		 	var queryParams = $.extend({},$("#tab").datagrid("options").queryParams);
		 			$("#tab").datagrid("reload",queryParams);
		 			$("#tab").datagrid("clearSelections");
		 		}
		 	});
		} */
		
	</script>
</head>
<body class="easyui-layout">
	<div region="north" border="false" style="height:80px;" iconCls="icon-search" title="查询条件">
		<table width="100%" height="100%" style="background-color:#E0ECFF ">
			<thead>
				<tr>
					<td align="center">记录名称：</td>
					<td><input type="text" name="spsbmc" id="sbmc-search" value="${smap.spxm }"></td>
					<td align="center">记录分类：</td>
					<td>
						<select name="spsbflid" id="sbflid-search">
							<option value="">--请选择记录--</option>
							<c:forEach items="${sbfl}" var="b">
								<option value="${b.id }" <c:if test="${smap.spsbflid==b.id }">selected</c:if>>${b.sbflmc }</option>
							</c:forEach>
						</select>
					</td>
					<td align="center">记录状态：</td>
					<td>
						<select name="spzt" id="zt-search">
							<option value="">-请选择状态-</option>
										<option value="0">使用</option>
										<option value="1">闲置</option>
										<option value="2">借出</option>
										<option value="3">待修</option>
										<option value="4">已坏</option>
									</select>
					</td>
					<td align="center">查询时间：</td>
					<td nowrap="nowrap">
						<input name="spbfjlsj" id="bfjlsj-search" class="easyui-datebox"/>到<input name="spafjlsj" id="afjlsj-search" class="easyui-datebox"/>
					</td>
					<td><a id="4" disabled="true" class="easyui-linkbutton" iconCls="icon-search" onclick="find()">查询</a></td>
				</tr>
			</thead>
		</table>
	</div>
	<div id="center" region="center">
		<table id="tab"></table>
	</div>
	
	<div id="sb-window" title="查看记录详情" style="width:500px;">
				
		<table class="ttb" border="0" cellspacing="0" cellpadding="0" width="100%">
							<tr>
								<td nowrap="nowrap" class="bg001" class="bg001">记录编号：</td>
								<td nowrap="nowrap" id="sb-sbbh">&nbsp;</td>
								<td nowrap="nowrap" class="bg001" class="bg001">记录类型：</td>
								<td nowrap="nowrap" id="sb-sbfl">&nbsp;</td>
								<td nowrap="nowrap" class="bg001">记录名称：</td>
								<td nowrap="nowrap" id="sb-sbmc">&nbsp;</td>
							</tr>
							<tr>
								<td nowrap="nowrap" class="bg001">记录属性：</td>
								<td id="sb-sbsx" colspan="5"></td>
							</tr>
							<tr>
								<td nowrap="nowrap" class="bg001">记录状态：</td>
								<td nowrap="nowrap" id="sb-zt" style="color:red;"></td>
								<td nowrap="nowrap" class="bg001">记录时间：</td>
								<td nowrap="nowrap" id="sb-jhsj" colspan="3">&nbsp;</td>
							</tr>		
							
		</table>
	</div>
	
	<div id="sb-add" title="添加记录" style="width:400px;height:400px;">
				<div style="text-align: center;padding-top: 5px;">
					<form method="post" action="/itmanager/sb/add">
						<table>
							<tr>
								<td width="40%">记录编号：</td>
								<td width="60%"><input name="sbbh" id="sbbh-add" type="text" class="easyui-validatebox" required="true"></input></td>
							</tr>
							
							<tr>
								<td>记录名称：</td>
								<td>
									<input name="sbmc" id="sbmc-add" type="text" class="easyui-validatebox" required="true"/>
								</td>
							</tr>
							<tr>
								<td>记录时间：</td>
								<td><input name="jhsj" id="jhsj-add" type="text" class="easyui-datebox" required="true" style="width:150px;"></input></td>
							</tr>
							<tr>
								<td style="color:red;">记录状态：</td>
								<td>
									<select name="zt" id="zt-add" style="width:150px;color: red;">
										<option value="0">使用</option>
										<option value="1">闲置</option>
										<option value="2">借出</option>
										<option value="3">待修</option>
										<option value="4">已坏</option>
									</select>
								</td>
							</tr>
							<tr></tr>
							<table id="add-table">
							
							</table>
							<input type="hidden" name="sbsx" id="sbsx-add">
							<input type="hidden" name="sbflid" id="sbflid-add">
						</table>
					</form>
				</div>
				<div style="text-align:center;">
					
					<a href="javascript:void(0)" onclick="createSb()" class="easyui-linkbutton" id="sb-add-button" icon="icon-save">添加</a>
					<a href="javascript:void(0)" onclick="closeSbadd()" class="easyui-linkbutton" id="sb-cancel-button" icon="icon-cancel">取消</a>
				</div>
		</div>
		
		<div id="sb-edit" title="修改记录信息" style="width:400px;height:400px;">
				<div style="text-align: center;padding-top: 5px;">
					<form method="post" action="/itmanager/sb/edit">
						<table>
							<tr>
								<td width="40%">记录编号：</td>
								<td width="60%"><input name="sbbh" id="sbbh-edit" type="text" class="easyui-validatebox" required="true"></input></td>
							</tr>
							<tr>
								<td>记录名称：</td>
								<td>
									<input name="sbmc" id="sbmc-edit" type="text" class="easyui-validatebox" required="true">
								</td>
							</tr>
							<tr>
								<td>进货时间：</td>
								<td><input name="jhsj" id="jhsj-edit" type="text" class="easyui-datebox" required="true" style="width:150px;"></input></td>
							</tr>
							<tr>
								<td style="color:red;">记录状态：</td>
								<td>
									<select name="zt" id="zt-edit" style="width:150px;color: red;">
										<option value="0">使用</option>
										<option value="1">闲置</option>
										<option value="2">借出</option>
										<option value="3">待修</option>
										<option value="4">已坏</option>
									</select>
								</td>
							</tr>
							<table id="edit-table">
							</table>
							<input type="hidden" name="sbsx" id="sbsx-edit">
						</table>
					</form>
				</div>
				<div style="text-align:center;">
					<a href="javascript:void(0)" onclick="editSb()" class="easyui-linkbutton" id="sb-edit-button" icon="icon-ok">修改</a>
					<a href="javascript:void(0)" onclick="closeSbedit()" class="easyui-linkbutton" id="sb-cancel-button" icon="icon-cancel">取消</a>
				</div>
		</div>
		
<div id="mm" style="width:100px;">
<c:forEach items="${sbfl}" var="b">
	<div iconCls="icon-basket" onclick="openWinSb('${b.id }')">${b.sbflmc }</div>
</c:forEach>
</div>
		

</body>
</html>